import Taro, {Component} from '@tarojs/taro'
import { AtInput, AtForm ,AtButton,AtMessage } from 'taro-ui'
import {View} from "@tarojs/components"
import './index.scss'
import {updateUserDetail} from "./service";
import {showErrorMsg} from '../../../../utils/index'
import {getGlobalData} from "../../../../global.d";
export default class Index extends Component {
  config = {
    navigationBarTitleText: '编辑个人信息'
  };
  constructor(props) {
    super(props);
    this.state = {
      school:'',
      college: '',
      major: '',
      grade: '',
      userRealName:'',
      phone:'',
      weChat: '',
      qq: '',
      email: '',

    }
  }
  componentDidMount() {
    const user = getGlobalData('user');
    this.setState({
      ...user.userDetail
    })
  }

  handleChange(key, val) {
    this.setState({
      [key]: val
    });
  }
  doSubmit() {
    const {school, college, major, grade, userRealName, phone, weChat, qq, email} = this.state;
    const regName = /^[\u4e00-\u9fa5]{2,4}$/;
    if(!regName.test(userRealName)){
      showErrorMsg('请正确输入你的姓名')
      return ;
    }
    if(phone.length<11){
      showErrorMsg('请正确手机号码')
      return ;
    }

    const user = getGlobalData('user');
    updateUserDetail(user._id,  {school, college, major, grade, userRealName, phone, weChat, qq, email});
  }

  render() {
    const {school, college, major, grade, userRealName, phone, weChat, qq, email} = this.state;
    return (
      <View>
        <AtForm

        >
          <AtInput
            name='school'
            title='学校'
            type='text'
            placeholder='请填写'
            value={school}
            onChange={this.handleChange.bind(this,'school')}
          />
          <AtInput
            name='college'
            title='学院'
            type='text'
            placeholder='请填写'
            value={college}
            onChange={this.handleChange.bind(this,'college')}
          />
          <AtInput
            name='major'
            title='专业'
            type='text'
            placeholder='请填写'
            value={major}
            onChange={this.handleChange.bind(this,'major')}
          />
          <AtInput
            name='grade'
            title='年级'
            type='text'
            placeholder='请填写'
            value={grade}
            onChange={this.handleChange.bind(this,'grade')}
          />
          <AtInput
            name='userRealName'
            title='姓名'
            type='text'
            placeholder='*必填（便于老师/班委管理）'
            value={userRealName}
            onChange={this.handleChange.bind(this,'userRealName')}
          />
          <AtInput
            name='phone'
            title='手机号'
            type='phone'
            placeholder='*必填（便于老师/班委管理）'
            value={phone}
            onChange={this.handleChange.bind(this,'phone')}
          />
          <AtInput
            name='weChat'
            title='微信'
            type='text'
            placeholder='请填写'
            value={weChat}
            onChange={this.handleChange.bind(this,'weChat')}
          />
          <AtInput
            name='qq'
            title='QQ'
            type='text'
            placeholder='请填写'
            value={qq}
            onChange={this.handleChange.bind(this,'qq')}
          />
          <AtInput
            name='email'
            title='邮箱'
            type='text'
            placeholder='请填写'
            value={email}
            onChange={this.handleChange.bind(this,'email')}
          />
          <AtButton type='primary' customStyle={{marginTop: '15PX'}}
                    onClick={this.doSubmit.bind(this)}
          >提交修改</AtButton>

        </AtForm>
        <AtMessage />
      </View>
    )
  }

}
